import React from 'react'
import {View,Text,Picker } from '@tarojs/components'
import Taro from '@tarojs/taro'
import { AtInput,AtButton,AtIcon,AtList, AtListItem }  from 'taro-ui'
import './index.scss'

let atButtonStyles = {
  margin: '20px',
  background: "#e93323",
  borderRadius: '30px',
  border: 'none'
}

let atButtonStylesWx = {
  margin: '20px',
  borderRadius: '30px',
  color:'#fe960f',
  backgroundColor: '#fff',
  border: "2px solid #fe960f"
}

let iconStyle = {
  position: 'absolute',
  top: '108px',
  right: '0',
  zIndex: '10'
}

export default function NewAddress(){

  function handleChange(e){
    console.log(e)
  }
  return (
    <View className='new_address'>
      <AtInput
        name='value'
        required
        title='姓名'
        type='text'
        placeholder='请输入姓名'
        onChange={(e) => {handleChange(e)}}
      />
      <AtInput
        name='value'
        required
        title='联系电话'
        type='text'
        placeholder='请输入联系电话'
        onChange={(e) => {handleChange(e)}}
      />

      <AtIcon customStyle={iconStyle} value='map-pin' size='26' color='#F00' />
      <AtInput
        name='value'
        title='所在地区'
        type='text'
        placeholder='省，市，区'
        onChange={(e) => {handleChange(e)}}
      />
      <AtInput
        name='value'
        title='详细地址'
        type='text'
        placeholder='请输入详细地址'
        onChange={(e) => {handleChange(e)}}
      />
      {/*按钮*/}
      <AtButton  customStyle={atButtonStyles} type='primary' size='normal ' onClick={() => {console.log(1)}}>立即保存</AtButton>
      <AtButton  customStyle={atButtonStylesWx} type='primary' size='normal ' onClick={() => {console.log(1)}}>导入微信地址</AtButton>
    </View>
  )
}
